<!-- 预订订单流水 -->
<template>
  <div class="common-body-wrapper">
    <search-header
      single-width="130"
      :searchList="searchList"
      @changeHeight="toRetTable"
      @confirmSearch="toSearch"
      :isNeedTree="true"
      :isCheckbox="true"
      @setSelectedNode="setSelectedNode"
      :paramName="paramName"
    ></search-header>
    <div class="common-table-tree-wrapper">
      <div class="common-table-wrapper">
        <multi-fun-table
          :sortColumn="notFormatColumn"
          :orderType="sortType"
          :fixed-cols="fixedCols"
          :is-reset-table="isResetTable"
          :theads-info="theadsInfo"
          :tbodys-info="tbodysInfo"
          @handleMultiCheck="handleMultiCheck"
          @handleSortColumn="handleSortColumn"
          @searchFn="getList"
          @getNextPage="getNextPage"
        >
          <div class="operate-btn-group" slot="operateBtnGroup">
            <a
              class="ake_btn ake_btn_text"
              v-if="isPermmited('MGR:SHARE:BOOKING_RECORD:EXPORT')"
              @click.prevent="exportData()"
            >导出</a>
          </div>
          <template slot="tdCell" slot-scope="props">
            <el-table-column
              :fixed="props.fixed"
              :label="props.label"
              :min-width="props.minWidth"
              :width="props.width"
              :prop="props.prop"
              :sortable="props.sortable"
            >
              <template slot-scope="scope">
                <span v-if="'reno' == props.prop&&scope.$index!==0">{{ scope.$index }}</span>
                <span v-else-if="'reno' == props.prop&&scope.$index==0">合计</span>
                <!-- <span v-else-if="'invoiceFilePath' == props.prop && scope.row['isOpenInvoice']=='0'" @click="copyLink(scope.row)" class="row-href">点击复制开票链接</span> -->
                <!--一点停暂不支持，先注释掉-->
                <span
                  v-else-if="'invoiceFilePath' == props.prop && scope.row['isOpenInvoice']=='1'"
                >无</span>
                <a
                  v-else-if="'invoiceFilePath' == props.prop && scope.row['isOpenInvoice']=='2'"
                  :href="scope.row['invoiceFilePath']"
                  download="invoice.pdf"
                  class="row-href"
                >已开票，点击下载</a>
                <span v-else>{{ scope.row[props.prop] }}</span>
              </template>
            </el-table-column>
          </template>

          <!--操作列内的按钮-->
          <template slot="operateCell" slot-scope="props">
            <el-table-column
              :fixed="props.fixed"
              :label="props.label"
              width="70"
              class-name="operateCell"
            >
              <template slot-scope="scope">
                <el-button
                  size="small"
                  type="primary"
                  icon="icon-refund"
                  class="ake-icon-font"
                  title="退款"
                  v-if="isPermmited('MGR:SHARE:BOOKING_RECORD:REFUND') && scope.$index!==0 && scope.row.recordStatus == 0"
                  @click="refundBookingRecord(scope.row.id)"
                  plain
                ></el-button>
              </template>
            </el-table-column>
          </template>
        </multi-fun-table>

        <table-pagination :size="total" :cur-page="pageNumber" @backData="getPagination"></table-pagination>
      </div>
    </div>

    <basic-modal ref="refundModal" width="400" static="true">
      <h3 slot="title">退款</h3>
      <div class="modal-body" slot="modal-body">
        <el-form
          ref="refundForm"
          :model="refundForm"
          :rules="rules"
          label-position="left"
          label-width="220px"
        >
          <el-form-item label="预订服务费剩余可退：">
            <span>{{bookingRecordVo.serviceFee}}元</span>
          </el-form-item>
          <el-form-item prop="refundServiceFee" label="预订服务费需退款(元）)">
            <el-input v-model.number="refundForm.refundServiceFee"></el-input>
          </el-form-item>
          <el-form-item label="预订停车费剩余可退：">
            <span>{{bookingRecordVo.parkingFee}}元</span>
          </el-form-item>
          <el-form-item prop="refundParkingFee" label="预订停车费需退款(元）)">
            <el-input v-model.number="refundForm.refundParkingFee"></el-input>
          </el-form-item>
        </el-form>
      </div>
      <div class="modal-footer" slot="modal-footer">
        <button class="ake_btn ake_btn_text modal-close" @click="closed('refundModal')">取消</button>
        <button class="ake_btn ake_btn_text ake_btn_confirm" @click.stop="confirmRefundForm()">确认</button>
      </div>
    </basic-modal>

    <basic-modal ref="delConfirmTipModal" bodyTxt="确定要退款吗？">
      <h3 slot="title">温馨提示</h3>
      <div class="modal-footer" slot="modal-footer">
        <button class="ake_btn ake_btn_text ake_btn_confirm" @click="submitRefundForm()">确定</button>
        <button class="ake_btn ake_btn_text modal-close" @click="closed('delConfirmTipModal')">关闭</button>
      </div>
    </basic-modal>
  </div>
</template>

<script>
import common from "@mixins/common.js";
import stardardList from "@mixins/tables/stardardList.js";

//modal
import invokeModal from "@mixins/modal/invokeModal.js";

// image
import images from "@mixins/image.js";

// 引进vue的js
import booking_record from "./js/booking_record.js";

export default {
  name: "bookingRecord",
  mixins: [common, stardardList, invokeModal, images, booking_record],
  props: ["setData"],
  data() {
    const today = [
      new Date(moment().format("YYYY-MM-DD 00:00:00")),
      new Date(moment().format("YYYY-MM-DD 23:59:59"))
    ];

    return {
      paramName: "parkIds",
      fixedCols: 4,
      total: 0,
      ones: 5566,
      searchList: [
        {
          index: 0,
          isShow: false,
          type: "datePicker",
          name: "query_time",
          text: "订单时间",
          propName: "createTimeFrom,createTimeTo",
          value: today,
          style: { width: "360px" }
        },
        {
          index: 1,
          isShow: false,
          type: "text",
          name: "bookingCode",
          text: "订单编号",
          value: ""
        },
        {
          index: 2,
          isShow: false,
          type: "text",
          name: "carCode",
          text: "车牌号",
          value: ""
        },
        {
          index: 3,
          isShow: false,
          type: "text",
          name: "userPhone",
          text: "手机号",
          value: ""
        },
        {
          index: 4,
          isShow: false,
          type: "select",
          name: "status",
          text: "订单状态",
          value: "",
          options: [
            { name: "全部", value: "" },
            { name: "已支付", value: "1" },
            { name: "已取消", value: "2" }
          ]
        },
        {
          index: 5,
          isShow: false,
          type: "datePicker",
          name: "query_in_time",
          text: "预订进场时间",
          propName: "enterTimeFrom,enterTimeTo",
          value: "",
          style: { width: "360px" }
        },
        {
          index: 6,
          isShow: false,
          type: "select",
          name: "isOpenInvoice",
          text: "是否开票",
          value: "",
          options: [
            { name: "全部", value: "" },
            { name: "未开票", value: "0" },
            { name: "纸质票", value: "1" },
            { name: "电子票", value: "2" }
          ]
        },

        {
          index: 7,
          isShow: false,
          type: "text",
          name: "invoiceNumber",
          text: "发票号码",
          value: ""
        }
      ],
      theadsInfo: [
        // { index: 0, isShow: false, prop: 'reno', text: '序号', width: 68 },
        {
          index: 1,
          isShow: false,
          prop: "bookingCode",
          text: "订单编号",
          minWidth: 60
        },
        {
          index: 2,
          isShow: false,
          prop: "status",
          text: "订单状态",
          minWidth: 50
        },
        {
          index: 3,
          isShow: false,
          prop: "parkName",
          text: "停车场",
          minWidth: 60
        },
        {
          index: 4,
          isShow: false,
          prop: "carCode",
          text: "预订车牌号",
          minWidth: 60
        },
        {
          index: 5,
          isShow: false,
          prop: "userPhone",
          text: "预订手机号",
          minWidth: 60
        },
        {
          index: 6,
          isShow: false,
          prop: "createTime",
          text: "订单时间",
          minWidth: 80,
          initHidden: true
        },
        {
          index: 7,
          isShow: false,
          prop: "enterTime",
          text: "预订进场时间",
          minWidth: 80,
          initHidden: true
        },
        {
          index: 8,
          isShow: false,
          prop: "leaveTime",
          text: "预订离场时间",
          minWidth: 80
        },
        {
          index: 9,
          isShow: false,
          prop: "serviceFee",
          text: "预订服务费",
          width: 50,
          initHidden: true
        },
        {
          index: 10,
          isShow: false,
          prop: "refundServiceFee",
          text: "预订服务费(退款)",
          minWidth: 50,
          initHidden: true
        },
        {
          index: 11,
          isShow: false,
          prop: "parkingFee",
          text: "预订停车费",
          minWidth: 50
        },
        {
          index: 12,
          isShow: false,
          prop: "refundParkingFee",
          text: "预订停车费(退款)",
          minWidth: 50,
          initHidden: true
        },
        {
          index: 13,
          isShow: false,
          prop: "updateTime",
          text: "订单状态更新时间",
          minWidth: 80,
          initHidden: true
        },
        {
          index: 14,
          isShow: false,
          prop: "payOriginStr",
          text: "支付来源",
          minWidth: 50,
          initHidden: true
        },
        {
          index: 15,
          isShow: false,
          prop: "payModeStr",
          text: "支付方式",
          minWidth: 50,
          initHidden: true
        },
        {
          index: 16,
          isShow: false,
          prop: "billCode",
          text: "支付流水号",
          minWidth: 60,
          initHidden: true
        },
        {
          index: 17,
          isShow: false,
          prop: "thirdBillCode",
          text: "第三方支付流水号",
          minWidth: 60,
          initHidden: true
        },
        {
          index: 18,
          isShow: false,
          prop: "isOpenInvoiceStr",
          text: "是否开票",
          sortable: true,
          minWidth: 50,
          initHidden: true
        },
        {
          index: 19,
          isShow: false,
          prop: "invoiceNumber",
          text: "发票号码",
          sortable: true,
          minWidth: 60,
          initHidden: true
        },
        {
          index: 20,
          isShow: false,
          prop: "invoiceFilePath",
          text: "开票链接",
          sortable: true,
          minWidth: 70,
          initHidden: true
        }
      ],
      tbodysInfo: []
    };
  },
  methods: {}
};
</script>

<style lang="less" scoped>
</style>
